<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>AsyncFlow流程图</title>
<!--    <script src="https://unpkg.com/gojs/release/go.js"></script>-->
    <script type="text/javascript" src="../js/go.js"></script>
    <script th:inline="javascript">
        function init() {

            var $ = go.GraphObject.make;
            var myDiagram =
                $(go.Diagram, "myDiagramDiv",
                    {
                        //模型图的中心位置所在坐标
                        initialContentAlignment: go.Spot.Center,
                        "undoManager.isEnabled": true,
                        layout: $(go.LayeredDigraphLayout,
                            {
                                direction: 90,
                                layerSpacing: 1,
                                columnSpacing:2,
                                setsPortSpots: true
                            })
                    });
            var title = [[${asyncFlowTitle}]];
            myDiagram.add(
                $(go.Part, { location: new go.Point(100, -40) },
                    $(go.TextBlock, title,
                        {
                            font: "bold 24pt sans-serif",
                            stroke: "green"
                        })
                ));
            myDiagram.nodeTemplate =
                $(go.Node,"Vertical",// "Horizontal,Vertical"
                    {background: "#44CCFF"},

                    // $(go.Picture,
                    //     {margin: 10, width: 50, height: 50, background: "red"},
                    //     new go.Binding("source")),
                    $(go.TextBlock, "Default Text",
                        {
                            font: "bold 13px sans-serif",
                            textAlign: "center",//文字左右对齐
                            verticalAlignment: go.Spot.Center,//文字垂直对齐
                            stroke: "white",
                            overflow: go.TextBlock.OverflowClip ,
                            maxLines: 3,
                            margin: 7,
                            width: 85
                        },
                        new go.Binding("text", "name"))

                );

            var model = $(go.GraphLinksModel);

            model.linkDataArray =  /*[[${asyncFlowNodeLinkData}]]*/ null;
            model.nodeDataArray =  /*[[${asyncFlowNodeDataArray}]]*/ null;

            myDiagram.model = model;
        }
    </script>
</head>
<body onload="init()">
<div id="myDiagramDiv" style="width:100%; height:1050px;border:1px solid black;"></div>
</body>
</html>